<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<title>用户组</title>
<link rel="shortcut icon" href="$request.getContextPath()/resources/cws/images/logo.ico" /> 
<link rel="stylesheet" type="text/css" href="$request.getContextPath()/resources/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="$request.getContextPath()/resources/layui/css/layui.css">
<link rel="stylesheet" href="$request.getContextPath()/resources/bootstrap-table/css/bootstrap-table.min.css" >
<style type="text/css">
body,.container-fluid{
  padding: 0px;
  margin: 0px;
  width:99.5%;
  height:100%;
}
.container-fluid .content{
  padding: 0px;
  margin: 0px;
  width:100%;
  height:100%;
}
.container-fluid .content .bootstrap-table{
  padding: 0px;
  margin: 0px;
  width:100%;
  height:100%;
}
</style>
</head>
<body>
  <div class="container-fluid">
	 <div class="content">
	    <div id="toolbar">
			#if($shiro.hasPermission('system:group:memberAdd'))
			   <button type="button" class="btn btn-default btn-sm" onclick="addGroupUser()"><span class="glyphicon glyphicon-plus"></span>添加</button>
			#end
	    </div>
	    <table id="table"
	           data-toggle="table"
	           data-toolbar="#toolbar" 
	           data-show-refresh="true"
	           data-search="false"
               data-show-toggle="false"
               data-show-columns="false"
	           data-show-export="false"
           	   data-pagination="false"
           	   data-query-params="queryParams"
           	   data-query-type="limit"
           	   data-show-footer="false"
           	   data-click-to-select="true"
           	   data-single-select="false"
           	   data-striped="true"
           	   data-method="get"
           	   data-url="$request.getContextPath()/system/group/members/$!groupId"
           	   data-side-pagination="server"
	           data-page-list="[10, 25, 50, 100, ALL]" 
	           data-show-pagination-switch="false"
           	   data-search-on-enter-key="true"
           	   data-pagination-v-align="bottom"
	           data-show-pagination-switch="false">
	        <thead>
			  <tr>
			     <!--<th data-checkbox="true" data-width="40px"></th>-->
                 <th data-field="userGroupId" data-visible="false">ID</th>
                 <th data-field="userId" data-visible="false">用户ID</th>
                 <th data-field="userName"  data-align="center" data-valign="middle">用户名称</th>
                 <th data-field="privilage"  data-align="center" data-valign="middle" data-formatter="operatePrivilageFormatter">用户权限</th>
                 <th data-field="createTime"  data-align="center" data-valign="middle">创建时间</th>
                 <th data-field="operate"  data-align="center" data-valign="middle" data-formatter="operateFormatter" data-events="operateEvents">操作</th>
			  </tr>
			</thead>
	    </table>
	 </div>
  </div>
</body>
<script type="text/javascript" src="$request.getContextPath()/resources/jquery/jquery-3.1.0.min.js"></script>
<script type="text/javascript" src="$request.getContextPath()/resources/bootstrap/js/bootstrap.min.js"></script>

<script type="text/javascript" src="$request.getContextPath()/resources/layer/layer.js"></script>
<script type="text/javascript" src="$request.getContextPath()/resources/layui/layui.js"></script>
<script type="text/javascript" src="$request.getContextPath()/resources/layui/lay/modules/element.js"></script>

<script type="text/javascript" src="$request.getContextPath()/resources/bootstrap-table/js/bootstrap-table.min.js"></script>
<script type="text/javascript" src="$request.getContextPath()/resources/bootstrap-table/js/bootstrap-table-zh-CN.min.js"></script>
<script type="text/javascript">
//组织机构图
function addGroupUser(){
	top.window.layer.open({
		 type: 2, 
		 title :'用户组添加用户',
		 maxmin: true,
		 content: ['$request.getContextPath()/system/group/memberAdd?groupId=$!groupId','yes'],
		 area: ['450px', '400px'],
		 end:function(){
			 queryGroupUser();
		 }
	});
}
//查询用户组
function queryGroupUser(){
	var $table = $('#table');    
	$table.bootstrapTable("refresh");
}
//显示用户身份
function operatePrivilageFormatter(value,row,index){
	if(value==1){
		return "普通员工";
	}else if(value==2){
		return "副组长";
	}else if(value==3){
		return "组长";
	}
}
//操作按钮
function operateFormatter(value, row, index) {
	var buttons=[];
	var memberViewGroupPermission="$shiro.hasPermission('system:group:memberView')";
	if(memberViewGroupPermission&&memberViewGroupPermission=="true"){
		buttons.push('<button type="button" class="btn btn-default btn-sm groupDetail"><span class="glyphicon glyphicon-eye-open"></span>查看</button>');
	}
	var memberEditGroupPermission="$shiro.hasPermission('system:group:memberEdit')";
	if(memberEditGroupPermission&&memberEditGroupPermission=="true"){
		buttons.push('<button type="button" class="btn btn-default btn-sm editGroup"><span class="glyphicon glyphicon-edit"></span>编辑</button>');
	}
	var memberDeleteGroupPermission="$shiro.hasPermission('system:group:memberDelete')";
	if(memberDeleteGroupPermission&&memberDeleteGroupPermission=="true"){
		buttons.push('<button type="button" class="btn btn-default btn-sm deleteGroup"><span class="glyphicon glyphicon-trash"></span>删除</button>');
	}
    return buttons.join('');
}
//表格点击事件
var operateEvents = {
        //机构组织详情
		'click .groupDetail': function (e, value, row, index) {
			top.window.layer.open({
				 type: 2, 
				 title :'查看用户组详情',
				 maxmin: true,
				 content: ['$request.getContextPath()/system/group/memberView/'+row.userGroupId,'yes'],
				 area: ['450px', '400px']
			});
        },
        //编辑机构组织
        'click .editGroup': function (e, value, row, index) {
        	top.window.layer.open({
				 type: 2, 
				 title :'编辑用户组',
				 maxmin: true,
				 content: ['$request.getContextPath()/system/group/memberEdit/'+row.userGroupId,'yes'],
				 area: ['450px', '400px'],
				 end:function(){
					 queryGroupUser();
				 }
			});
        },
        //删除机构组织
        'click .deleteGroup': function (e, value, row, index) {
        	layer.confirm('你确定从用户组中移除用户【'+row.userName+'】吗?', {icon: 3, title:'提示'}, function(index){
        		$.post("$request.getContextPath()/system/group/memberDelete/"+row.userGroupId,{_method:'delete'},function(data){
        			if(data.code==200){
        				queryGroupUser();
    			    	layer.close(index);
        			}else{
        				layer.alert(data.msg);
        			}
        		});
        	});
        }
};
</script>
</html>